const path = require('path')
const { IgnorePlugin } = require('webpack')
const resolve = dir => path.join(__dirname, dir)

const argv = require('minimist')(process.argv.slice(2))
const port = argv.port || 9053

/** @type {import('@vue/cli-service').ProjectOptions} */
module.exports = {
  publicPath: process.env.NODE_ENV === 'development' ? '/' : '/pro/',
  lintOnSave: process.env.NODE_ENV === 'development',
  productionSourceMap: false,
  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          javascriptEnabled: true
        }
      }
    }
  },
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'less',
      patterns: [ resolve('src/themes/common/import.less') ]
    }
  },
  configureWebpack: {
    performance: { hints: false },
    resolve: {
      alias: {
        'style-variables': resolve('src/themes/common/import.less')
      }
    },
    plugins: [
      new IgnorePlugin(/^\.\/locale$/, /moment$/)
    ]
  },
  chainWebpack: config => {
    config.plugins.delete('prefetch')

    const svgRule = config.module.rule('svg')
    svgRule.uses.clear()

    svgRule
      .test(/\.svg$/)
      .include.add(resolve('src/assets/svg'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({ symbolId: 'pro-icon-[name]' })
      .end()

    config.plugin('html').tap(args => {
      args[0].title = process.env.VUE_APP_TITLE
      return args
    })
  },
  devServer: {
    port,
    open: false,
    overlay: {
      warnings: false,
      errors: true
    },
    proxy: {
      '/api': {
        target: 'http://localhost:8080/mock',
        changeOrigin: true,
        pathRewrite: { '^/api': '' }
      }
    }
  }
}
